import { createRouter, createWebHashHistory } from 'vue-router'
// 1.导入页面
// 父页面
import Layout from '@/views/layout'
// 子页面：首页
const Home = () => import('@/views/home')
// import Home from '@/views/home'
// 分类页面
const Cate = () => import('@/views/cate')
// import Cate from '@/views/cate'
// 商品详情页面
const Good = () => import('@/views/good')
// 登陆页面
const Login = () => import('@/views/login')
// 购物车页面
const Cart = () => import('@/views/cart')

// 创建订单
const Order = () => import('@/views/order')
// 支付订单
const Pay = () => import('@/views/pay')
// 支付结果
const PayResult = () => import('@/views/pay/result')

// 配置路由
const routes = [
  {
    path: '/',
    component: Layout,
    children: [
      // 首页
      {
        path: '/',
        component: Home
      },
      // 分类
      {
        path: '/cate/:id',
        component: Cate
      },
      // 商品详情
      {
        path: 'good/:id',
        component: Good
      },
      // 购物车
      {
        path: '/cart',
        component: Cart
      },
      // 订单
      {
        path: '/order',
        component: Order
      },
      // 支付
      {
        path: '/pay',
        component: Pay
      },
      // 支付成功
      {
        path: '/pay/callback',
        component: PayResult
      }

    ]
  },
  {
    path: '/login',
    component: Login
  }

]
// vue2 => new Router()
// vue3 => createRouter()
/**
 * 路由模式修改：
 * vue2 => mode:'hash | history'
 * vue3 => history: createWebHashHistory() | createWebHistory()
 */
const router = createRouter({
  history: createWebHashHistory(),
  routes,
  // vue2: scrollBehavior: () => ({ y: 0 }),
  // vue3：每次跳页面把滚动条距离顶部的值，重置为0
  scrollBehavior () {
    return { top: 0 }
  }
})

export default router
